<template>
	<div>
    <code>
      <svg-icon icon-class="message" style="margin-right:10px;color:red;font-size:20px;"></svg-icon>
      备注：短信提醒设置(用于接收下单通知等)
    </code>
		<p class="c-mh16">
			<label class="label-css">接收方:</label><el-input type="tel" :maxlength="11" v-model="mallConfig.mallSmsRecipient" placeholder="请输入接收方手机号" style="width: 300px"></el-input>
		</p>
		<p  class="c-mh16"><label class="label-css">是否启用:</label>
			<!-- <el-select v-model="mallConfig.enableMallSms" clearable placeholder="请选择" style="width: 300px">
				<el-option v-for="item in options" :key="item.id" :label="item.value" :value="item.id"></el-option>
			</el-select> -->
      <el-radio-group v-model="mallConfig.enableMallSms">
        <el-radio v-for="item in options" :key="item.id" :label="item.id" :value="item.id">{{item.value}}
        </el-radio>
      </el-radio-group>
		</p>
		<p v-if="permission == 3" style="width: 500px;text-align: center;"><el-button type="primary" icon="el-icon-check" @click="save('message')">保存</el-button></p>
	</div>
</template>
<script>
const options = [
  { id: 1, value: '是' },
  { id: -1, value: '否' }
]
export default {
  props: ['mallConfig', 'permission'],
  data() {
    return {
      options
    }
  },
  methods: {

    save(msg) {
      if (this.mallConfig.enableMallSms == 1 && (isNaN(this.mallConfig.mallSmsRecipient) || this.mallConfig.mallSmsRecipient.length != 11)) {
        this.$message({
          message: '请输入正确的手机号',
          type: 'error'
        })
        return
      }
      if (this.mallConfig.enableMallSms == 1 && !this.mallConfig.mallSmsRecipient) {
        this.$message({
          message: '选择启用的话请输入手机号',
          type: 'error'
        })
        return
      }
      this.$emit('save', msg)
    }
  }
}
</script>
<style scoped>
	h3{
		font-weight: 500;
	}
	.label-css{
		font-weight: 500;
		font-size: 14px;
		display: inline-block;
		width: 110px;
		text-align: right;
		margin-right: 20px;
	}
</style>
